<template>
  <div class="ruleInfo-container">
    <Dialogdrawerdefect
      :ddtvisible.sync="ruleInfoEditVisible"
      size="650px"
      :modal="true"
      :modal-append-to-body="false"
      :has-modal="true"
    >
      <div class="ruleInfo-wrap" v-loading="loading" @click.stop="()=>{}">
        <div class="aiw-grid">
          <div class="aig-title">
            <div class="tit">参数设置{{dep?`【批量修改部门：${dep}】`:''}}</div>
          </div>
          <ruleTemplate ref="ruleTemplate" :hospital-code="hospitalCode" :dep="dep"></ruleTemplate>
          <div v-show="depNum>1" class="rule_tips">注意：多检查部门联合修改时段{{ruleType==='2'?'模板':''}}限制条件，检查部位与检查项目谨慎选择！</div>
        </div>

        <div class="aiw-footer">
          <div class="ft_tips">提示：批量修改 <b>{{totalCount}}</b> 条预约时段{{ruleType==='2'?'模板':''}}限制条件，<span class="fc_red">谨慎修改</span>！</div>
          <el-button size="small" @click="close">返回</el-button>
          <el-button size="small" type="primary" @click="ruleInfoSend">提交</el-button>
        </div>
      </div>
    </Dialogdrawerdefect>
  </div>
</template>

<script>
import Dialogdrawerdefect from '@/components/dialogbox/dialogDrawerDefect'
import ruleTemplate from './ruleTemplate'

export default {
  components: {
    Dialogdrawerdefect,
    ruleTemplate
  },
  props: {
    ruleType: {
      type: String,
      default: '1'
    }
  },
  data() {
    return {
      loading: false,
      ruleInfoEditVisible: false,
      appoInfo: {},
      totalCount: 0,
      // 检查项目
      checkroom: [],
      hospitalCode: '',
      dep: '',
      depNum: 0
    }
  },
  methods: {
    init(data) {
      const { appoInfo, hospitalCode, dep, totalCount } = data
      this.appoInfo = { ...appoInfo }
      this.ruleInfoEditVisible = true
      this.totalCount = totalCount
      this.hospitalCode = hospitalCode
      this.dep = dep
      this.depNum = dep.split(',').length
      this.loading = false
      this.$nextTick(() => {
        this.$refs.ruleTemplate && this.$refs.ruleTemplate.init(appoInfo)
      })
    },
    // 提交
    async ruleInfoSend() {
      let ruleParams = await this.$refs.ruleTemplate.getRuleData()
      this.$confirm(`批量修改 ${this.totalCount} 条预约时段${this.ruleType === '2' ? '模板' : ''}限制条件，是否继续？`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.loading = true
        this.$emit('appoRuleEidtCb', JSON.parse(ruleParams).appointmentFilters)
      }).catch(() => {})
    },
    // 关闭弹框
    close() {
      this.loading = false
      this.ruleInfoEditVisible = false
    }
  }
}
</script>

<style lang="scss" scoped>
.ruleInfo-wrap{
  min-height: calc(100vh - 50px);
  display: flex;
  flex-direction: column;
  padding-bottom: 54px;
  .aiw-grid{
    flex:1;
    padding: 10px 15px 0;
  }
  .aiw-footer{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 10;
    text-align: right;
    padding: 10px 20px;
    border-top: solid 1px #DCDFE6;
    background-color: #fff;
  }
}
.aig-title{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 0;
  .tit{
    font-size: 14px;
    font-weight: bold;
    color: #333;
  }
}
.ft_tips{
  float: left;
  margin-top: 10px;
  color: #666;
}
.rule_tips{
  margin-top: 10px;
  color: #666;
}
</style>
